<template>
  <div>
    <a-modal v-model:visible="visible">
      <template #title> 原酒记录 </template>
      <a-form :model="form" :rules="rules" ref="formRef" @submit="handleSubmit">
        <a-form-item field="group_id" label="分组">
          <a-select
            :placeholder="'请选择分组---' + groupList.length + '组'"
            v-model="form.group_id"
            allow-clear
          >
            <a-option
              v-for="(item, i) in groupList"
              :key="i"
              :value="item.group_id"
              :label="item.group_alias"
            ></a-option>
          </a-select>
        </a-form-item>
        <a-form-item field="types" label="类型">
          <a-select
            :placeholder="'请选择类型---' + typesList.length + '组'"
            v-model="form.types"
            allow-clear
          >
            <a-option
              v-for="(item, i) in typesList"
              :key="i"
              :value="item.value"
              :label="item.label"
            ></a-option>
          </a-select>
        </a-form-item>
        <a-form-item field="out_date" label="生产日期">
          <a-date-picker
            style="width: 100%"
            v-model="form.pro_date"
            placeholder="请选择生产时间"
          />
        </a-form-item>
        <a-form-item field="mao" label="毛重">
          <a-input-number v-model="form.mao" placeholder="请输入毛重">
            <template #append> 公斤 </template>
          </a-input-number>
        </a-form-item>
        <a-form-item field="pi" label="皮重">
          <a-input-number v-model="form.pi" placeholder="请输入皮重">
            <template #append> 公斤 </template>
          </a-input-number>
        </a-form-item>
        <a-form-item field="jing" label="净重">
          <a-input-number v-model="form.jing" placeholder="请输入净重">
            <template #append> 公斤 </template>
          </a-input-number>
        </a-form-item>
        <a-form-item field="temp" label="温度">
          <a-input-number v-model="form.temp" placeholder="请输入温度">
            <template #append> ° </template>
          </a-input-number>
        </a-form-item>
        <a-form-item field="wine_du" label="酒精度">
          <a-input-number v-model="form.wine_du" placeholder="请输入酒精度">
            <template #append> % </template>
          </a-input-number>
        </a-form-item>
        <a-form-item field="zhe_he_du" label="折合酒度">
          <a-input-number v-model="form.zhe_he_du" placeholder="请输入折合酒度">
            <template #append> % </template>
          </a-input-number>
        </a-form-item>
        <a-form-item field="zhe_six_five_du" label="65度重量">
          <a-input-number
            v-model="form.zhe_six_five_du"
            placeholder="请输入折合65度重量"
          >
            <template #append> 公斤 </template>
          </a-input-number>
        </a-form-item>
        <a-form-item label="酒罐">
          <a-select v-model="form.tank_id" placeholder="请选择存放的酒罐">
            <a-option
              v-for="(item, i) in tankList"
              :key="i"
              :label="item.wine_tank_name"
              :value="item.id"
            ></a-option>
          </a-select>
        </a-form-item>
      </a-form>
      <template #footer>
        <a-button type="primary" @click="save">确定</a-button>
      </template>
    </a-modal>
  </div>
</template>

<script lang="ts" setup>
import { ref, reactive } from 'vue';
import { getProducedataList } from '@/api/producetion';
import { saveWinePro } from '@/api/winepro';
import dayjs from 'dayjs';
import { Message } from '@arco-design/web-vue';

const save = async () => {
  const { code, message } = await saveWinePro(form);
  if (code === 200) {
    Message.success(message);
    props.getWineProInf();
    visible.value = false;
  }
};
const props = defineProps({
  getGuige: { type: Function },
  groupList: { type: Array },
  getWineProInf: { type: Function },
  tankList: { type: Array },
});
const typesList = ref([
  { label: '大楂', value: 1 },
  { label: '二楂', value: 2 },
]);
const visible = ref(false);
const productiondata = ref([]);
const formLoading = ref(false);
const recordInfo = ref();
const openDialog = async (record: any) => {
  recordInfo.value = record;
  form.group_id = '';
  form.types = 1;
  form.pro_date = '';
  form.mao = '';
  form.pi = '';
  form.jing = '';
  form.temp = '';
  form.wine_du = '';
  form.zhe_he_du = '';
  form.zhe_six_five_du = '';
  visible.value = true;
};

const form = reactive({
  types: 1,
  group_id: '',
  pro_date: '', // 生产日期
  mao: '',
  pi: '',
  jing: '',
  temp: '', // 温度
  wine_du: '', // 酒精度
  zhe_he_du: '', // 折合度
  zhe_six_five_du: '', //折合65度
  tank_id: '',
});
defineExpose({
  openDialog,
});

const columns = ref([
  {
    title: '#',
    dataIndex: 'index',
    slotName: 'index',
    align: 'center',
  },
  {
    title: '酒类',
    slotName: 'winetype_id',
    align: 'center',
  },
  {
    title: '规格',
    slotName: 'winetype_speci',
    align: 'center',
  },
  {
    title: '生产日期',
    slotName: 'produce_time',
    align: 'center',
  },
  {
    title: '产量/箱',
    dataIndex: 'produce_box',
    align: 'center',
  },
  {
    title: '产量/瓶',
    dataIndex: 'produce_bottle',
    align: 'center',
  },
  {
    title: '批次',
    dataIndex: 'product_batch',
    align: 'center',
  },
  {
    title: '是否定制',
    slotName: 'product_costom',
    align: 'center',
  },
  {
    title: '备注',
    dataIndex: 'product_remark',
    align: 'center',
  },
]);
</script>

<style lang="scss" scoped></style>